<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .root div {
            height: 100px;
        }

        .left,
        .right {
            width: 300px;
            background-color: yellow;
        }

        .left {
            float: left;
        }

        .right {
            float: right;
        }

        .center {
            /* margin: 0 300px; */
            background-color: red;
        }
    </style>
</head>

<body>
    <div class="root">
        <div class="left">left</div>
        <div class="right">right</div>
        <div class="center">center Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus repellat nemo fugit
            odio corporis quia enim dicta. Eius, magni velit, assumenda nam obcaecati consectetur alias aliquid
            perferendis libero neque illum?</div>
    </div>
</body>

</html>